<template>
    <div class="person">
        <h2>标签的ref属性</h2>
        <h2>用在普通标签上获取的是DOM节点</h2>
        <h2>用在组件标签上获取的是组件实例对象</h2>
        <p iref="content">我在Person中</p>
        <button @click="showLog">Person试一试</button>
    </div>
</template>

<script lang="ts" setup name="Person">
import { ref } from 'vue';
//用于存储ref标记的内容
let content =ref();
let a=ref(1);
let b=ref(2);
let c=ref(3);

//暴露数据
//宏函数，不需要引入
defineExpose({a,b,c});
function showLog(){
    console.log(content.value);
}
</script>

<style lang="css" scoped>
p{
    font-size: 20px;
}</style>